<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>人事管理系统 ——后台管理</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="pragma" content="no-cache"/>
    <meta http-equiv="cache-control" content="no-cache"/>
    <meta http-equiv="expires" content="0"/>
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"/>
    <meta http-equiv="description" content="This is my page"/>
    <link href="fkjava.ico" rel="shortcut icon" type="image/x-icon"/>
    <link href="../css/css.css" type="text/css" rel="stylesheet"/>
    <script type="text/javascript" src="../js/jquery-1.11.0.js"></script>
    <script type="text/javascript" src="../js/jquery-migrate-1.2.1.js"></script>
    <script type="text/javascript" src="../js/tiny_mce/tiny_mce.js"></script>
    <script type="text/javascript" src="../js/jquery.form.js"></script>

    <script src="../js/a/vue.js"></script>
    <script src="../js/a/axios-0.18.0.js"></script>
    <link rel="stylesheet" href="../css/index.css">
    <script src="../js/a/index.js"></script>
    <script src="../js/a/axios-config.js"></script>
    <!--  <script type="text/javascript">-->

    <!--    $(document).ready(function () {-->

    <!--      /** 表单提交的校验 */-->
    <!--      $("#btn").click(function () {-->
    <!--        var title = $("#title").val();-->
    <!--        var file = $("#file").val();-->

    <!--        if ($.trim(title).length <= 2) {-->
    <!--          alert("请输入两个字符以上的标题");-->
    <!--          return;-->
    <!--        }-->

    <!--        //$("#documentForm").submit();-->

    <!--      })-->
    <!--    });-->


    <!--  </script>-->
</head>
<body>
<div id="editfile">
    <table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td height="10"></td>
        </tr>
        <tr>
            <td width="15" height="32"><img src="../images/main_locleft.gif" width="15" height="32"></td>
            <td class="main_locbg font2"><img src="../images/pointer.gif">&nbsp;&nbsp;&nbsp;当前位置：文档管理 &gt; 修改文档
            </td>
            <td width="15" height="32"><img src="../images/main_locright.gif" width="15" height="32"></td>
        </tr>
    </table>

    <table width="100%" height="90%" border="0" cellpadding="10" cellspacing="0" class="main_tabbor">
        <tr valign="top">
            <td>


                <!-- 隐藏表单，flag表示添加标记 -->
                <input type="hidden" name="flag" value="2">
                <input type="hidden" name="id" value="${document.id }">
                <table width="100%" border="0" cellpadding="0" cellspacing="10" class="main_tab">

                    <tr>
                        <td class="font3 fftd">


                            文档标题：<input type="text" name="title" size="30" id="title" v-model="formData.title"/></td>
                    </tr>
                    <tr>
                        <td class="main_tdbor"></td>
                    </tr>


                    <tr>
                        <td class="font3 fftd">文档描述：<br/>
                            <textarea name="remark" cols="88" rows="11" id="content"
                                      v-model="formData.remark"></textarea>
                        </td>
                    </tr>
                    <tr>
                        <td class="main_tdbor"></td>
                    </tr>

                    <tr>
                        <td class="font3 fftd">文档：<br/>
                            <input type="file" size="30" ref="fileId" @click="getFile"/>
                        </td>
                    </tr>
                    <tr>
                        <td class="main_tdbor"></td>
                    </tr>


                    <tr>
                        <td class="font3 fftd">
                            <input type="button" id="btn" value="确定" @click="edit">
                            <input type="button" value="重置" @click="back">
                        </td>
                    </tr>
                    <tr>
                        <td class="main_tdbor"></td>
                    </tr>


                </table>

            </td>
        </tr>
    </table>
    <div style="height:10px;"></div>
</div>
<script>
    new Vue({
        el: '#editfile',
        data: {
            formData: {
                title: '',
                remark: '',
                file: null
            }
        },
        mounted() {
            this.getParam()
        },
        methods: {
            // 获取url传值
            getQueryString: function (key) {
                let reg = new RegExp("(^|[&\?])" + key + "=([^&]*)(&|$)");
                let result = window.location.search.match(reg);
                return result ? decodeURIComponent(result[2]) : null;
            },
            getParam: function () {
                this.formData.id = this.getQueryString("id");
                // console.log(this.id)
                this.formData.title = this.getQueryString("title");
                this.formData.remark = this.getQueryString("remark");
            },
            edit: function () {
                this.getFile();
                if (this.title !== '' || this.remark !== '') {
                    axios.post('/api/file/edit', this.objToFormData(this.formData))
                        .then(res => {
                            if (res.data.code == 200) {
                                this.$message.success('修改成功')
                                setTimeout(() => window.location.replace('document.html'), 1500);
                            } else if (res.data.msg) {
                                this.$message.error(res.data.msg);
                            } else {
                                this.$message.error('系统错误');
                            }
                        })
                } else {
                    this.$message.error('标题或详情不能为空')
                }
            },
            back: function () {
                this.formData.title = '';
                this.formData.remark = '';
                this.$refs.fileId.value=''
            },
            getFile() {
                this.formData.file = this.$refs.fileId.files[0];
                console.log(this.formData.file);
            },
            objToFormData(obj) {
                let formData = new FormData()
                for (let k in obj) {
                    if (obj[k] != null && obj[k] !== undefined) {
                        formData.append(k, obj[k]);
                    }
                }
                return formData;
            },
        }
    })
</script>
</body>
</html>